<template>
  <div class="model-container">
    <div class="listName">敏感词管理列表</div>

    <el-card style="margin-top: 10px">
      <div slot="header" class="clearfix">
        <div class="btns-wrapper-left customSensitive">
          <el-button type="primary" plain><a href="https://www.yfishing.cn/mall-admin/v1/sensitiveWord/downloadTemplate" download="w3logo">下载模板</a></el-button>
          <el-button type="primary" plain @click="add">批量导入</el-button>
          <div class="remark">敏感词一行为一个，使用前请删除当前模板内文字</div>
        </div>
      </div>
      <el-input :autosize="{ minRows: 10, maxRows: 15}" v-model="textarea" type="textarea" placeholder="" readonly resize="none" />
    </el-card>

    <!--弹框-->
    <el-dialog :title="dialogTitle" :visible.sync="dialogState" :before-close="handleClose" top="5vh" width="60%">
      <el-form ref="dialogBindData" :model="dialogBindData" :rules="rules" label-width="30%" status-icon class="demo-ruleForm">
        <div class="formBody">
          <el-form-item label="" prop="" class="three">
            <txt />
          </el-form-item>
          <div class="btns-wrapper">
            <el-button size="small" @click="handleClose">取 消</el-button>
            <el-button :loading="buttonState" type="primary" size="small" @click="submmitFun">导 入</el-button>
          </div>
        </div>
      </el-form>

    </el-dialog>

  </div>
</template>
<script>
import * as sensitive from '../../api/sensitive.js'
import txt from '../../views/sensitive/component/uploadTxt'
export default {
  components: {
    txt
  },
  data() {
    return {

      // 列表数据
      dataOption: null,
      pageNo: 1,
      pageSize: 10,
      rowCount: null, // 总条数
      textarea: '',
      dialogTitle: '从txt导入',
      // 对话框表单数据对象
      dialogBindData: {
        cateGoryName: ''
      },
      rules: {

      },
      type: '',
      dialogState: false,
      editorData: null,
      dialogType: 1, // 1--增加  2--编辑  3--查看
      // 按钮状态
      buttonState: false,
      delBtn: true,
      delIdArr: []
    }
  },

  beforeMount() {
    // 	  this.type = this.$route.params.type // 类型
    // 	  this.editorData = this.$route.params.data // 编辑数据

    this.getList()
  },

  methods: {

    // 重置
    resetFun() {
      this.$refs.seacherParam.resetFields()
      this.getList()
    },
    // 删除
    changeFun(data) {
      this.datavalID = data
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`)
      this.pageSize = val
      this.getList()
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`)
      this.pageNo = val
      this.getList()
    },
    handleClose() {
      for (const key in this.dialogBindData) {
        if (key === 'sellerType') {
          this.dialogBindData[key] = 1
        } else if (key === 'settlementPeriod') {
          this.dialogBindData[key] = 1
        } else {
          this.dialogBindData[key] = ''
        }
      }
      this.dialogState = false
      this.disabled = false
      this.disableIinput = false
      // this.$refs.dialogBindData.clearValidate()
    },
    // 查询列表数据
    getList() {
      const param = {
        current: this.pageNo,
        size: 9999
      }
      sensitive.getSensitiveWord(param).then(res => {
        console.log('查询视频列表', res)
        if (res.data.code !== 1) {
          this.$message.error(res.data.msg)
          return false
        }
        if (res.data.data === 'null' || res.data.data === null) {
          return false
        }

        for (const i in res.data.data.records) {
          this.textarea += res.data.data.records[i].content
        }
      })
    },
    // 添加
    add() {
      this.dialogType = 1
      this.dialogState = true
    },

    // 编辑
    edit(data) {
      this.dialogType = 2
      this.dialogState = true
      this.disabled = true
    },

    iconData(data) {

    },
    submmitFun() {
      this.dialogState = false
      this.disabled = false
      this.disableIinput = false
      const param = {
        current: this.pageNo,
        size: 9999
      }

      sensitive.getSensitiveWord(param).then(res => {
        if (res.data.code !== 1) {
          this.$message({
            message: res.data.msg,
            type: 'warning'
          })
          this.buttonState = false
          return false
        }
        this.$message({
          message: '编辑成功',
          type: 'success'
        })
        this.buttonState = false
        this.getList()
        this.handleClose()
      })
    },
    // 删除
    del(data) {
      if (data === 0) {
        if (this.datavalID.length === 0) {
          this.$message({
            type: 'warning',
            message: '请选择商家!'
          })
        }
        return false
      }
      this.$confirm('确认要删除敏感词吗,是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.delDataTable(data)
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    },

    // 下载模板
    download() {

    }

  }
}
</script>
<style>
	.customSensitive>div{float:left;margin-right: 20px;}
	.customSensitive .remark{color:#FF0000;float:right;margin-top: 10px;margin-left: 20px;}
</style>
